<#include "/common/head.ftl">

<@showTitle title="${i18n.getMessage('configuration')}">
</@showTitle>

<br/>

<form id="form1">
<b>USD:</b> <strong class="bold" id="amount">${amount?string('#,##0')!}</strong> <span id="newdate">(${(date)!})</span> 
<a href="#" onClick="cc('system/listCurrency.sgt')">${i18n.getMessage('currency.list')}</a> 
<@showWhen roles=['Administrating']>
| <a href="#" onClick="getLatest()">${i18n.getMessage('currency.update')}</a>
</@showWhen> 

<#-- input type="text" name="date" value="${(date)!}" class="w080 center" disabled="disabled" / -->
<#-- input type="text" name="amount" value="${(amount)!}" class="w050 center" disabled="disabled" / -->
<#-- input type="text" id="date" name="date" value="${now?date}" class="w080 center" onblur="$('amount').value=''" ondblclick="displayCalendar(document.forms[0].date, '${i18n.getMessage('format.date')}', this)" /--> 
<#-- input type="text" id="amount" name="amount" class="w050 center" /-->
<#-- a style="text-decoration:underline" href="#" onclick="updateCurrency()">Update</a -->
<#-- a style="text-decoration:underline" href="#" onclick="updateOnlineCurrency()">Get from Vietcombank</a -->

</form>
<br/>
<@display.table id="listTable" name="parameters" sort="list" defaultsort="1">
<@display.column title="${i18n.getMessage('name')}">${(listTable.comment)!}</@display.column>
<@display.column title="${i18n.getMessage('value')}" style="width:25%;text-align:center"><input type="text" value="${(listTable.value)!}" style="width:97%"/></@display.column>
<@display.column title="${i18n.getMessage('edit')}" style="text-align:center;width:50px;"><img src="images/edit.gif" style="cursor:pointer" onclick="editParameter(${(listTable.id)!}, ${listTable.isNumber?string}, this)"/></@display.column>
</@display.table>
<br/><br/>

<script>
editParameter = function(id, isNumber, img) {
	var tds = img.parentNode.parentNode.getElementsByTagName("td");
	var value = tds[1].getElementsByTagName("input")[0];
	if(value.value == null || value.value.length <= 0) {
		alert("Value is required !");
		return;
	} 
	if(isNumber) {
		if(isNaN(value.value)) {
			alert("Value must be a number !");
			return;
		}
	}
	new Ajax.Request('system/editParameter.sgt'.appendURL('id', id).appendURL('value', value.value));	
}

updateCurrency = function() {
	new Ajax.Request('system/updateCurrency.sgt?' + $('form1').serialize(), {
  		onSuccess: function(transport) {
    		$('amount').value = transport.responseText;
  		}
	});	
}

updateOnlineCurrency = function() {
	new Ajax.Request('system/onlineCurrency.sgt', {
  		onSuccess: function(transport) {
    		$('amount').value = transport.responseText;
  		}
	});	
}
getLatest = function() {
	new Ajax.Request('system/getLatest.sgt', {
  		onSuccess: function(transport) {
  			text = transport.responseText.split(";");
    		$('amount').innerHTML = text[0];
    		$('newdate').innerHTML = "("+text[1]+")";
  		}
	});
}

updateCurrency();
</script>